<template>
    <div class="app-container">
        <el-form ref="form" :model="form" :rules="formRules" label-width="120px" size="medium">
            <el-form-item label="评价对象">
                <el-select v-model="roles" placeholder="请选择角色类型" style="width:300px">
                    <el-option :value="item" :label="item" v-for="(item,index) in this.rolesList" :key="index"/>
                </el-select>
            </el-form-item>
            <el-form-item label="工作中心:" prop="workCenter">
                <el-select v-model="form.workCenter" @focus="getCenterList" style="width:300px">
                  <el-option :value="item" :label="item" v-for="(item,index) in this.centerList" :key="index"/>
                </el-select>
            </el-form-item>
            <el-form-item label="代码" prop="performanceCode" >
                <el-input
                clearable
                v-model="form.performanceCode"
                class="filter-item"
                placeholder="请输入代码"
                style="width:300px"></el-input>
            </el-form-item>
            <el-form-item label="考评内容" prop="performanceDesc">
                <el-input
                type="textarea"
                autosize
                placeholder="请输入考评内容"
                v-model="form.performanceDesc"
                style="width:300px">
                </el-input>
            </el-form-item>
            <el-form-item label="分值" prop="score">
                <el-input
                clearable
                v-model="form.score"
                class="filter-item"
                placeholder="请输入分值"
                style="width:300px"></el-input>
            </el-form-item>
            <el-form-item label="类型" prop="type">
                <el-input
                clearable
                v-model="form.type"
                class="filter-item"
                placeholder="请输入类型"
                style="width:300px"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submitForm('form')">添加</el-button>
                <el-button type="primary" @click="resetForm('form')">重置</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
import { savePerformanceInfo,saveDirectorScore } from '@/api/evaluate'
import {getCenter } from '@/api/workSection.js'
export default {
    name: 'add_evaluate',
    data() {
        return {
            form: {
                performanceCode: '',          //代码
                performanceDesc: '',        //考评内容
                score: '',         //分值
            },
            rolesList: [
                '员工',
                // '工段'
            ],
            centerList: [],
            roles: '员工',
            formRules: {
                performanceCode: [
                    { required: true, message: '请输入代码', trigger: 'blur' }
                ],
                performanceDesc: [
                    { required: true, message: '请输入考评内容', trigger: 'blur' }
                ],
                score: [
                    { required: true, message: '请输入分值', trigger: 'blur' }
                ],
                type: [
                    { required: true, message: '请输入类型', trigger: 'blur' }
                ],
                workCenter: [
                    { required: true, message: '请输入工作中心', trigger: 'blur' }
                ]
            }
        }
    },
    methods: {
        // 对表单进行重置
        resetForm(formItem) {
            this.$refs[formItem].resetFields()
        },
        // 提交表单之前先进行验证
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.submit()
                } else {
                    return false
                }
            })
        },
        // 提交绩效评价表单信息
        async submit() {
          let query = {}
          if(this.roles == '员工'){
            query = Object.assign({},this.form)
          } else {
            query.directorScoreCode = this.form.performanceCode
            query.directorDesc = this.form.performanceDesc
            query.score = this.form.score
          }
          const data = this.roles == '员工'?await savePerformanceInfo(query):await saveDirectorScore(query)
          const errMsg = data.msg
          if(data.code == '1') {
            this.$message({
              showClose: true,
              message: errMsg,
              type: 'success'
            })
            this.resetForm()
          } else {  
            this.$message({
              showClose: true,
              message: errMsg,
              type: 'warning'
            })
          }
        },
        // 获取工作中心
        async getCenterList() {
          let {data} = await getCenter()
          this.centerList = data
          this.centerList.forEach((item,index) => {
            if(item.trim() == '焊喷车间'){ this.centerList.splice(index,1) }
          });
        },
    }
}
</script>

<style>

</style>